<!--
 * @Author: chenjianxin
 * @Date: 2020-07-22 14:43:55
 * @LastEditTime: 2021-04-06 18:07:40
 * @LastEditors: ganxiaochuan
 * @Description: 翻页
 * @FilePath: \ui-standard\src\components\AppPagination.vue
-->
<template>
  <div class="pagination">
    <el-pagination
      :page-size="pageData.pageSize"
      :page-sizes="DEV_CONFIG.DEFAULT_PAGE_SIZES || [30, 50, 100, 500]"
      :current-page="pageData.pageIndex"
      layout="total, sizes, prev, pager, next, jumper"
      @size-change="setPageSize"
      @prev-click="setPageIndex"
      @next-click="setPageIndex"
      @current-change="setPageIndex"
      :total="pageData.total">
    </el-pagination>
  </div>
</template>
<script>
import DEV_CONFIG from '@/config'

export default {
  data() {
    return{
      DEV_CONFIG
    }
  },
  props: {
    pageData: {
      require: true,
      type: Object
    }
  },
  methods: {
    setPageSize(pageSize) {
      this.$emit('sizeChange', pageSize)
    },
    setPageIndex(pageIndex) {
      this.$emit('indexChange', pageIndex)
    }
  }
}
</script>
<style lang="scss" scoped>
.pagination {
  text-align: center;
  height: 60px;
  padding-top: 15px;
  display: flex;
  justify-content: flex-end;
}
</style>
